<template>
	<div class="box8">
		<div class="topb">
			<el-input placeholder="请输入门店名称" class="inpsa" v-model="inpname" @keyup.enter.native="search"></el-input>
			<el-date-picker placeholder="请输入起始时间" style="width: 170px; margin-right: 10px;" v-model="startTime"
			>
			</el-date-picker>
			<el-date-picker placeholder="请输入结束时间" style="width: 170px; margin-right: 10px;" v-model="endTime"
				>
			</el-date-picker>
			<el-button type="primary" icon="el-icon-search" class="search" @click.native="search">搜索</el-button>
 
		</div>
		<div class="banner">
			<el-table :data="ticket" style="width: 100%" >
				<el-table-column prop="outletName" label="门店名">
				</el-table-column>
				<el-table-column prop="sellNums" label="销售量">
				</el-table-column>
				<el-table-column prop="totalPrice" label="总收入">
				</el-table-column>
				<el-table-column>
					<template slot="header">
						操作
					</template>
					<template slot-scope="scope">
						<el-button type="danger" size="small" style="padding: 7px 10px;font-size: 12px;"
							@click.stop="salesDetail(scope.row)">更多</el-button>
					</template>
				</el-table-column>
			</el-table>
			<!--分页-->
			<el-row>
				<el-col style="text-align:right">
					<el-pagination layout="prev, pager, next" :total="total" :page-size="pagesize"
						:current-page="currentpage" @current-change='changePage'></el-pagination>
				</el-col>
			</el-row>
		</div>
	</div>
</template>
<script>
export default {
	data() {
		return {
			baseUrl: require("../assets/baseUrl.js").baseUrl,
			inpname: "",
			startTime: "",
      endTime:"",
      newstartTime:"",
      newendTime:"",
			name: "",
			goodsname: "",
			date: "",
			username: "",
			total: 0, //总数据条数
			currentpage: 1, //当前所在页默认是第一页
			pagesize: 5, //每页显示多少行数据 默认设置为10
			ticket: [], //这里是从后端获取的所有数据
		}
	},
	methods: {
		// 获取页面的表格所有数据
		getTicket() {
			// sells/getSellStatisticByOutlet
      this.$http.post(this.baseUrl+"sells/getSellStatisticByOutlet",{
        page:this.currentpage,
        size:this.pagesize
      }).then(res=>{
        if(res.data.code==200){
          this.ticket=res.data.data.sells
          this.total=res.data.data.totalPages*this.pagesize
        }
      })
		},
    salesDetail(v){
      sessionStorage.removeItem("newstartTime")
      sessionStorage.removeItem("newendTime")
      if(this.newstartTime!=""){
        sessionStorage.setItem("newstartTime",this.newstartTime)  
      }
      if(this.newendTime!=""){
        sessionStorage.setItem("newendTime",this.newendTime)
      }
      this.$router.push("/staticsproject/statistics?outletId="+v.outletId)
    },
		//分页
		changePage(page) {
      this.currentpage=page
      this.searchs()
		},
		//搜索
		search(){
			this.currentpage=1
			this.searchs();
		},
    controlTime(){
      let date1=this.startTime
      if(date1){
        let year=date1.getFullYear()
        let month=date1.getMonth()+1
        let day=date1.getDate()
        this.newstartTime=year+"-"+month+"-"+day
      }
      if(this.endTime){
        let year2=this.endTime.getFullYear()
        let month2=this.endTime.getMonth()+1
        let day2=this.endTime.getDay()
        this.newendTime=year2+"-"+month2+"-"+day2
      }
		},
		searchs() {
      this.controlTime()
      this.$http.post(this.baseUrl+"sells/getSellStatisticByOutlet",{
        page:this.currentpage,
        size:this.pagesize,
        outletName:this.inpname,
        beginTime:this.newstartTime,
        endTime:this.newendTime
      }).then(res=>{
        if(res.data.code==200){
          this.ticket=res.data.data.sells
          this.total=res.data.data.totalPages*this.pagesize
        }
      })
		}
	},
	mounted() {
		this.getTicket()
	}
}
</script>
<style lang="less">
.box8 {
	display: flex;
	flex-direction: column;

	.topb {
		width: 80vw;
		height: 65px;
		display: flex;
		align-items: center;
		margin-bottom: 15px;
		margin-left: 30px;
		position: relative;
	}

	.banner {
		float: left;
		display: flex;
		flex-direction: column;
		width: 80vw;
		margin-left: 30px;
	}

	.el-pagination {
		margin-top: 30px;
		text-align: center;
	}

	.el-input__prefix {
		font-size: 24px;
	}

	.inpsa {
		width: 140px;
		margin-right: 10px;
	}

	.heng {
		height: 65px;
		line-height: 60px;
		font-size: 20px;
		margin-left: 30px;
	}

	.cell {
		text-align: center;
		display: flex;
		justify-content: center;
	}

	.el-input--prefix .el-input__inner {
		width: 170px;
		padding-left: 30px;
	}

	.search {
		display: flex;
		align-items: center;
		
		.el-input {
		    margin: 0 5px;
		}
		
	}

	
}
</style>